<template>
    <customizePickerVue :pickerValue.sync="pickerValue" :picker-column="pickerColumn" @bindChange="changePicker" center-symbol="至"/>
</template>

<script>
    import customizePickerVue from '@/components/customize-picker/customize-picker.vue';

    export default {
        props: {
            labelName: String,
            value: String,
            selectList: {
                type: Array,
                default: () => []
            },
        },
        components: {
            customizePickerVue,
        },
        data() {
            return {
                newVal: '',
                pickerValue: [],
                pickerColumn: [
                    {
                        suffix: '',
                        key: 'min',
                        listKey: 'min',
                        list: [],
                    },
                    {
                        suffix: '',
                        key: 'max',
                        listKey: 'max',
                        list: [],
                    },
                ]
            };
        },
        watch: {
            value: {
                handler(val){
                    if (val && this.newVal !== val) {
                        this.newVal = val;
                        this.initPickerValue();
                    }
                },
                immediate: !0,
            },
            selectList: {
                handler(val){
                    this.initPickerColumn();
                },
                deep: !0,
                immediate: !0,
            },
        },
        mounted(){
        },
        methods: {
            initPickerColumn(){
                const list = this.selectList.map(v => v.valueName);
                // console.log(list);
                this.pickerColumn.forEach(v => {
                    v.list = list;
                })
                this.initPickerValue();
            },
            initPickerValue(){
                const lists = [];
                const val = this.value || this.newVal || '0-0'; // 如果都是空就给第一个为默认
                this.pickerColumn.forEach((v,i) => {
                    const index = v.list.findIndex(item => String(item) === String(val.split('-')[i]));
                    lists.push(index > -1 ? index : 0);
                })
                this.pickerValue = lists;
            },
            resetTime(){
            },
            endChange(){
            },
			changePicker(){
				const temVal = [];
                const testVal = []
				this.pickerValue.forEach((v, i) => {
					const str = this.pickerColumn[i].list[v];
					temVal.push(str);
					testVal.push(Number(str.replace('元','')));
				});
                let title;
                if (testVal[0] > testVal[1]) title = '最小值不能大于最大值';
                if (title) {
                    uni.showToast({
                        title,
                        icon: 'none',
                        mask: !0,
                    })
                    this.initPickerValue();
                    return false;
                }
                this.$emit('update:value',temVal.join('-'));
			},
        }
    }
</script>

<style lang="less" scoped>
</style>
